/**
 * Created by Jacky.Gao on 2018-04-15.
 * Base on Webpack4
 * Development Configuration
 */
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');

module.exports = {
    mode: 'development',
    entry: {
        designer: './src/index.js',
        searchform: './src/form/index.js',
        preview: './src/preview.js'
    },
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'js/[name].bundle.js',
        publicPath: '/'
    },
    devtool: 'eval-source-map', // 开发环境源码映射
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: "babel-loader",
                options: {
                    presets: ['env'],
                    cacheDirectory: true // 启用缓存提高构建速度
                }
            },
            {
                test: /\.css$/,
                use: [
                    { loader: 'style-loader' },
                    {
                        loader: 'css-loader',
                        options: {
                            sourceMap: true // 启用CSS源码映射
                        }
                    }
                ]
            },
            {
                test: /\.(eot|woff|woff2|ttf|svg|png|jpg|gif)$/,
                use: [
                    {
                        loader: 'url-loader',
                        options: {
                            limit: 10000000
                        }
                    }
                ]
            }
        ]
    },
    devServer: {
        static: {
            directory: path.join(__dirname, 'dist')
        },
        compress: true,
        port: 8081, // 改为8081避免端口冲突
        hot: true, // 热重载
        open: true, // 自动打开浏览器
        historyApiFallback: true, // 支持HTML5 History API
        client: {
            logging: 'info' // 控制台输出级别
        }
    },
    resolve: {
        extensions: ['.js', '.json'],
        alias: {
            '@': path.resolve(__dirname, 'src')
        }
    },
    plugins: [
        // 复制 public 目录到 dist
        new CopyWebpackPlugin({
            patterns: [
                { from: 'public', to: '.' }
            ]
        }),
        // 为每个入口创建 HTML 文件
        new HtmlWebpackPlugin({
            template: './public/designer.html',
            filename: 'designer.html',
            chunks: ['designer'],
            inject: false
        }),
        new HtmlWebpackPlugin({
            template: './public/searchform.html',
            filename: 'searchform.html',
            chunks: ['searchform'],
            inject: false
        }),
        new HtmlWebpackPlugin({
            template: './public/html-preview.html',
            filename: 'preview.html',
            chunks: ['preview'],
            inject: false
        })
    ],
    optimization: {
        // 禁用自动代码分割，避免生成 preview~searchform.bundle.js 等文件
        splitChunks: false
    }
};